// webpack.common.js (公共配置)
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');

module.exports = {
    // entry: './src/js/main.js',
    entry: {
        // main: './src/js/main.js',         // 主js文件
        bootstrap: './src/js/bootstrap.js', // Bootstrap 样式
        fontawesome: './src/js/fontawesome.js', // Font Awesome 样式
        swiper: './src/js/swiper.js',         // swiper
        custom: './src/js/custom.js',    // 自定义样式

        // product_ori: './src/js/product_ori.js',    // js
        product: './src/js/product.js',    // js
    },
    output: {
        filename: 'js/[name].js', // 使用 contenthash 缓存优化
        path: path.resolve(__dirname, 'dist'),
        clean: true, // 每次构建时清理 dist 目录
    },
    plugins: [
        new HtmlWebpackPlugin({ template: './src/index.html' }),

        // new MiniCssExtractPlugin({
        //     // filename: '[name].[contenthash].css',
        //     filename: 'css/[name].css', // 开发环境下不带哈希值
        // }),
    ],
    ignoreWarnings: [
        /Deprecation Warning/,
    ],
    module: {
        rules: [
            { test: /\.txt$/, use: 'raw-loader' },
            {
                test: /\.css$/, // 匹配 .css 文件
                use: [
                    MiniCssExtractPlugin.loader, // 将 CSS 提取到单独的文件
                    'css-loader',               // 解析 CSS 文件
                ],
            },
            {
                mimetype: 'image/svg+xml',
                scheme: 'data',
                type: 'asset/resource',
                parser: {
                    dataUrlCondition: {
                        maxSize: 8 * 1024, // 小于 8KB 的文件以内联形式存在
                    },
                },
                generator: {
                    filename: 'icons/[hash].svg',
                },
            },
            {
                test: /\.(scss)$/,
                use: [
                    MiniCssExtractPlugin.loader,
                    'css-loader',
                    {
                        loader: 'postcss-loader',
                        options: {
                            postcssOptions: {
                                plugins: [require('autoprefixer')],
                            },
                        },
                    },
                    {
                        loader: 'sass-loader',
                        options: {
                            sassOptions: { quietDeps: true },
                        },
                    },
                ],
            },
            // 处理字体文件
            {
                test: /\.(woff|woff2|eot|ttf|otf)$/i,
                type: 'asset/resource',
                generator: {
                    filename: 'fonts/[name].[hash][ext]', // 字体文件输出到 fonts/ 目录
                },
            },
        ],
    },
    // optimization: {
    //     splitChunks: {
    //         cacheGroups: {
    //             styles: {
    //                 name: 'common', // 提取的公共 CSS 文件名
    //                 type: 'css/mini-extract',
    //                 chunks: 'all',
    //                 enforce: true,
    //             },
    //         },
    //     },
    // },

};

